<template>
  <div class="over clearfix">
    <div class="sitebox">
      <div class="site" v-if="list.length == 0">
        <van-button
          plain
          type="primary"
          color="#ff9900"
          @click="$router.push('/site')"
          >+点击完善收货地址</van-button
        >
      </div>
      <div class="site" v-else>
        <van-address-list
          v-model="list.id"
          :list="list"
          default-tag-text="默认"
          @edit="onEdit"
        />
      </div>
      <div class="under">
        <div>
          <b>品牌精选</b>
          <p class="free"><span>以免运费</span>|<span>领劵</span></p>
        </div>
        <div v-for="item in lister" :key="item.id">
          <van-card
            :num="item.num"
            :price="item.price"
            :thumb="$pre + item.img"
          />
        </div>
        <div>
          <p class="row"><b>发票类型</b><span>不开发票></span></p>
          <p class="row"><b>售后免邮</b><span>部分商家赠送</span></p>
          <p class="row"><b>卖家留言</b><span>填写内容需要与商家确认</span></p>
          <div class="price">
            <p class="row">
              <b>商品金额</b><span>{{ d.countmoney }}</span>
            </p>
            <p class="row"><b>优惠活动</b><span>-￥200</span></p>
            <van-coupon-cell />
          </div>
        </div>
      </div>
    </div>
    <footer>
      <div>
        <p>
          <span>合计</span><span>{{ d.countmoney }}</span>
        </p>
        <p><span>以免运费</span><span>以优惠</span></p>
      </div>

      <div>
        <van-button type="primary" @click="sub">提交订单</van-button>
      </div>
    </footer>
  </div>
</template>

<script>
import { reqSitelist, reqCartlist, reqSubmit } from "../../http/http";
import { Toast } from "vant";

export default {
  data() {
    return {
      list: [],
      lister: [],
      d: JSON.parse(sessionStorage.getItem("d")),
    };
  },
  methods: {
    onEdit(item, index) {
      this.$router.push("/site");
    },
    getsite() {
      reqSitelist({
        uid: JSON.parse(localStorage.getItem("user")).uid,
      }).then((res) => {
        if (res.data.code == 200) {
          this.list = res.data.list ? res.data.list : [];
          this.list = this.list.map((item) => {
            return {
              id: item.id,
              name: item.username,
              tel: item.userphone,
              address: item.location + item.useraddress,
              isDefault: item.status == 1 ? true : false,
            };
          });
          if (this.$route.query.site) {
            this.list = this.list.slice(
              this.list.findIndex((item) => item.id == this.$route.query.site),
              this.list.findIndex((item) => item.id == this.$route.query.site) +
                1
            );
            return;
          } else {
            this.list = this.list.slice(0, 1);
            console.log(this.list);
          }
        }
      });
    },
    sub() {
      reqSubmit({
        uid: JSON.parse(localStorage.getItem("user")).uid,
        countmoney:JSON.parse(sessionStorage.getItem("d")).countmoney,
        countnumber: JSON.parse(sessionStorage.getItem("d")).countnumber,
        addressid: this.list[0].id,
        idstr: JSON.parse(sessionStorage.getItem("d")).idstr,
      }).then((res) => {
         this.$router.push("/pay?orderId="+res.data.list.outTradeNo)
      });
    },
  },
  mounted() {
    this.getsite();

    //获取购物车
    let idstr = JSON.parse(sessionStorage.getItem("d")).idstr; //"13,14"
    let idarr = idstr.split(","); //["13","14"]
    // 循环数组，将请到的数据放入list中
    idarr.forEach((item) => {
      reqCartlist({
        uid: JSON.parse(localStorage.getItem("user")).uid,
        id: item,
      }).then((res) => {
        if (res.data.code == 200) {
          this.lister.push(res.data.list[0]);
        }
      });
    });
  },
};
</script>

<style lang="less" scoped>
@import "../../less/index.less";
.over {
  min-height: 100vh !important;
  background: #eee !important;
}
.sitebox {
  height: 2rem;
  background: @primary;
  border: 1px solid @primary;
  box-sizing: border-box;
}
.site {
  height: 2rem;
  background: @while;
  margin: 0.4rem auto;
  width: 95%;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

//新增地址隐藏
.van-address-list__bottom {
  display: none;
}
.free {
  float: right;
}
.under {
  padding: 0.15rem;
  background: #fff;
}
.free span:nth-child(2) {
  color: @primary;
}
.row {
  display: flex;
  justify-content: space-between;
  margin: 0.3rem;
}
.price {
  margin-top: 0.5rem;
}
footer {
  background: #fff;
  width: 100%;
  justify-content: space-between;
  display: flex;
  position: fixed;
  left: 0;
  bottom: 0;
}
footer div p {
  margin-top: 0.18rem;
}
footer div span {
  margin: 0.2rem;
}
</style>
